
Ext.define('MyApp.view.EditAppointment', {
    extend: 'Ext.Panel',
	xtype: 'editappointment',
	id: 'editappointment',
	requires: ['Ext.ux.DateTimePicker'
	],
		listeners: {
		'deactivate': function(panel){
			panel.destroy();
		}
	},
	initialize: function() {
		var storage = window.localStorage;
		var userID = storage.getItem("UserID");
		
		var userIdField = Ext.getCmp('userId');
		userIdField.setValue(userID);
		console.log(userIdField.getValue());
		
		//Load the default settings
		var localstore = Ext.getStore("LocalSettings");
		localstore.load();
		var record = localstore.getAt(0);
		
		if (record.data.sendcalendar == "true"){
			var cal = Ext.getCmp("calendar");
			cal.check();
		}
		
		if (record.data.sendmap == "true"){
			var map = Ext.getCmp("maplink");
			map.check();
		}
		
		if (record.data.sendreminder == "true"){
			var rem = Ext.getCmp("reminder");
			rem.check();
		}
		
		var msg = Ext.getCmp("message");
		msg.setValue(record.data.confirmationmessage);
		
	},
    config: {
        items: [
             {
                xtype: 'titlebar',
                docked: 'top',
                title: 'Appointment',
                items: [
                    {
                        xtype: 'button',
                        ui: 'back',
                        text: 'Back'
                    },
                    {
                        xtype: 'button',
                        align: 'right',
                        ui: 'decline',
                        iconAlign: 'right',
                        text: 'Delete'
                    }
                ]
            },
            
            // {
                // xtype: 'button',
                // docked: 'bottom',
                // ui: 'action',
                // text: 'Create Appointment',
				// handler: function() {
					// var form = Ext.getCmp('appointmentForm');
					// var values = form.getValues();
					
					// Ext.Ajax.request({
						// url: 'http://www.upto.ca/appointment/appointment.php',
						// params: values,
						
						// success: function(response){
							// var text = response.responseText;
							// var result = Ext.decode(text);
							// console.log(values.mobile);
							// var data = Ext.JSON.decode(response.responseText.trim());
							// url = "http://www.upto.ca/appointment/createappointment.php?id=" + data.id;
							// console.log(data.Success)
							// if (data.Success == 'true'){
								
							
							
								 // var message = "Appointment With: " + values.name + ".";
								 // console.log(values.calendar);
								 // console.log(values.maplink);
								 // if (values.calendar != null) {
									// message += " Download Calendar: " + url;
								 // }
								 
								 // if (values.maplink != null){
									// message += " Map Link: In Progress ";
								 // }
								 // console.log(message);
								// window.plugins.SmsPlugin.send(values.mobile, 
								// message, 
								// function () { 
								   // alert('Message sent successfully');	
								// },
								// function (e) {
									// alert('Message Failed:' + e);
								// }
							 // );
								// Ext.getCmp('mypanel').destroy();
								// Ext.Viewport.setActiveItem('viewport', {type:'slide', direction:'left'});
							// }
						// },
						
						// failure: function(response){
							// Ext.Msg.alert('error', 'error submitting appointment');
							// console.log(response.responseText);
						// }
					
					
					
					// });
					
				// }
            // },
            {
                xtype: 'formpanel',
				id: 'editAppointmentForm',
				itemId: 'editAppointmentForm',
                height: '100%',
                width: '100%',
                scrollable: true,
				url: 'http://appt.elasticbeanstalk.com/appointment.php',
				standardSubmit: true,
                items: [
                    
                    {
						xtype: 'fieldset',
						centered: true,
						items: [
							{
								xtype: 'textfield',
								label: 'First',
								id: 'firstname',
								name: 'firstname'
							},
							{
								xtype: 'textfield',
								label: 'Last',
								id: 'lastname',
								name: 'lastname'
							},
							{
								xtype: 'numberfield',
								label: 'Phone',
								id: 'mobile',
								name: 'mobile'
							},
							{
								xtype: 'emailfield',
								label: 'Email',
								placeHolder: 'email@example.com',
								id: 'email',
								name: 'email'
							},
							{
								xtype: 'datepickerfield',
								label: 'Date',
								placeHolder: 'mm/dd/yyyy',
								id: 'date',
								name: 'date'
							},
							{
								xtype: 'datetimepickerfield',
								name : 'starttime',
								label: 'Start',
								id: 'starttime',
								dateTimeFormat : 'H:i',
								name: 'starttime',
								picker: {
									yearFrom: 1980,
									minuteInterval : 1,
									slotOrder: ['hour','minute']
								}
														
							},
							{
								xtype: 'datetimepickerfield',
								name : 'endtime',
								label: 'End',
								id: 'endtime',
								name: 'endtime',
								dateTimeFormat : 'H:i',
								picker: {
									yearFrom: 1980,
									minuteInterval : 1,
									slotOrder: ['hour','minute']
								}
														
							},
							{
								xtype: 'textareafield',
								label: 'Notes',
								id: 'notes',
								name: 'notes'
							},
							{
								xtype: 'textfield',
								label: 'Location',
								autoCapitalize: true,
								id: 'map',
								name: 'map'
							},
							{
								xtype: 'checkboxfield',
								label: 'Map',
								id: 'maplink',
								name: 'maplink'
							},
							{
								xtype: 'checkboxfield',
								label: 'Calendar',
								id: 'calendar',
								name: 'calendar'
							},
							{
								xtype: 'checkboxfield',
								label: 'Reminder',
								id: 'reminder',
								name: 'reminder'
							},
							{
								xtype: 'numberfield',
								label: 'Time',
								id: 'remindertime',
								name: 'remindertime'
							},
							{
								xtype: 'textareafield',
								height: 151,
								label: 'Message',
								id: "message",
								name: "message"
							},
							{
								xtype: 'hiddenfield',
								name: 'userId',
								value: 1,
								id: 'userId'
							},
							{
								xtype: 'hiddenfield',
								name: 'sentby',
								value: '',
								id: 'sentby'
							}
						]
					},
					{
                xtype: 'container',
                docked: 'bottom',
                layout: {
                    type: 'hbox'
                },
                items: [
                    {
                        xtype: 'button',
                        flex: 1,
                        margin: 2,
                        ui: 'action',
                        text: 'Save'
                    },
                    {
                        xtype: 'button',
                        flex: 1,
                        margin: 2,
                        ui: 'action',
                        text: 'Email'
                    },
                    {
                        xtype: 'button',
                        flex: 1,
                        margin: 2,
                        ui: 'action',
                        text: 'SMS'
                    }
                ]
				}
               ]
            }
        ]
    }

});